<template>
	<!-- shopactivitydetails店铺活动详情 -->
	<view class="s_wp">
		<view class="s_list">
			<view class="s_item">标题：</view>
			<input class="s_input" type="text" v-model="info.title" placeholder="请输入活动标题" />
		</view>
		<view class="s_list">
			<view class="s_item">开始时间：</view>
			<uni-datetime-picker class="s_datetime" v-model="info.begintime" />
		</view>
		<view class="s_list">
			<view class="s_item">结束时间：</view>
			<uni-datetime-picker class="s_datetime" v-model="info.endtime" />
		</view>
		<view class="h_list" v-for="(item,index) in info.rule" :key='index'>
			<view class="s_list">
				<view class="s_item">消费起送金额：</view>
				<input class="s_input" type="number" v-model="item.money" placeholder="请输入消费起送金额" />
			</view>
			<radio-group class="s_radio-group" @change="radioChange">
				<view class="s_item s_radio_title">送米券:</view>
				<!-- <view class="s_radio_wp">
					<radio :value="String(index)+'||0'" color="#8405dc" class="s_radio" :checked="item.type=='0'" />
					<view>固定值：<input type="number" v-model="item.credit" placeholder="返米券数" /></view>
				</view> -->
				<view class="s_radio_wp">
					<radio :value="String(index)+'||1'" color="#8405dc" class="s_radio" :checked="item.type=='1'" />
					<view>比例：<input type="number" v-model="item.rate" placeholder="返贝比例" />%</view>
				</view>
			</radio-group>
			<view class="s_delete">
				<button size="mini" type="warn" @click="deleteTap(index)">删除</button>
			</view>

		</view>
		<view class="s_missage">
			提示：比例为0%-100%
		</view>
		<view class="s_list">
			<button size="mini" class="s_addbk" type="default" @click="addBkTap">添加消费送米券</button>
		</view>
		<view class="fbt" @click="onsumbit">提交活动</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {
					id: '',
					title: '',
					begintime: new Date() * 1,
					endtime: new Date() * 1,
					rule: []
				},
			}
		},
		onLoad(option) {
			this.info.id = option.id ? option.id : '';
			if (this.info.id) this.getinfo();
		},
		methods: {
			onsumbit() {
				if (this.info.title == '') {
					this.$api.msg('请完善活动信息！');
					return;
				}
				if (this.info.rule.length <= 0) {
					this.$api.msg('请完善活动信息！');
					return;
				}
				let arr = this.info.rule;
				for (let i in arr) {
					if (arr[i].money === '') {
						this.$api.msg('请完善活动信息！');
						return;
					}
				}
				let obj = JSON.stringify(this.info);
				obj = JSON.parse(obj);
				obj.begintime = Date.parse(obj.begintime) ? Date.parse(obj.begintime) : obj.begintime;
				obj.endtime = Date.parse(obj.endtime) ? Date.parse(obj.endtime) : obj.endtime;
				obj.begintime = parseInt(obj.begintime / 1000);
				obj.endtime = parseInt(obj.endtime / 1000);
				let rulelist = obj.rule;
				obj.rule = rulelist.map(v => {
					return v.money + ',' + v.type + ',' + v.credit + ',' + v.rate;
				})
				obj.rule = obj.rule.join('|');
				this.$axios('info/saleSave', 'POST', 'supplier', obj).then(res => {
					if (res.data.code == 200) {
						this.$api.msg('提交成功！');
						setTimeout(() => {
							this.$navBack();
						}, 500)
					}
				})

			},
			addBkTap() {
				let obj = {
					credit: "0.00",
					money: "",
					rate: "0.00",
					type: "1",
				}
				this.info.rule.push(obj);
			},
			deleteTap(e) {
				this.info.rule.splice(e, 1);
			},
			radioChange(e) {
				let arr = e.detail.value.split('||');
				this.info.rule[Number(arr[0])].type = arr[1];
			},
			getinfo() {
				this.$axios('info/saleInfo', 'POST', 'supplier', {
					id: this.info.id
				}).then(res => {
					if (res.data.code == 200) {
						this.info = res.data.data;
						this.info.begintime = this.info.begintime * 1000;
						this.info.endtime = this.info.endtime * 1000;
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		color: $font-color-dark;
		padding-bottom: 120upx;
	}

	.s_list {
		display: flex;
		align-items: center;
		padding: 20upx;
	}

	.s_input {
		flex: 1;
		font-size: 26upx;
	}

	.s_missage {
		color: $font-color-light;
		padding: 0 20upx;
		text-align: center;
	}

	.s_addbk {
		background: $font-color-spec;
		color: #fff;
		height: 70upx;
		line-height: 70upx;
		width: 300upx;
	}

	.s_radio-group,
	.s_radio_wp,
	.s_radio_wp view {
		display: flex;
		align-items: center;
		padding: 20upx;
	}

	.s_radio_title {
		width: 100upx;
	}

	.s_radio_wp {
		padding: 0;
	}

	.s_radio {
		transform: scale(0.8);
	}

	.s_radio_wp view {
		padding: 0;
	}

	.s_radio_wp view input {
		color: $font-color-spec;
		flex: 1;
		font-size: 26upx;
	}

	.s_delete {
		text-align: center;
	}

	.fbt {
		position: fixed;
		bottom: 0;
		left: 3%;
		z-index: 10;
	}
</style>
